<template>
    <div>
      <div class="video-search">
        <Input placeholder="请输入视频标题" style="width: 300px" clearable autofocus></Input>
        <Button type="info" style="margin-left:10px" @click="searchUnAuditVideo(0, 10)">查询</Button>
        <Button type="error" style="margin-left:10px" >清空</Button>
      </div>
      <Divider>待审核视频列表</Divider>
      <div style="padding: 50px">
        <Table max-height="600" stripe border :columns="columns" :data="respVideoData.data" ref="selection" @on-selection-change="getSelectList">
          <template  slot-scope="{ row, index }" slot="title">
            <a @click="toVideoDetail(row)">{{row.title}}</a>
          </template>
          <template slot-scope="{ row, index }" slot="action">
            <Button type="success" style="margin-right: 5px" @click="videoAudit(row,1)">通过</Button>
            <Button type="error" style="margin-right: 5px" @click="videoAudit(row,0)">不通过</Button>
          </template>
        </Table>
        <Page :total="respVideoData.total" show-sizer show-elevator show-total @on-change="getCurrentPage"
              @on-page-size-change="getPageCount" style="margin-top: 50px"></Page>
      </div >
    </div>
</template>

<script>
    import VideoService from "../services/VideoService";
    import AuthPermissionService from "../services/AuthPermissionService";

    export default {
        name: "VideoAuditComponent",
        data(){
          return{
            videoService:null,
            authPermissionService:null,
            formData:{
              searchTitle:"",
              currentPage:0,
              pageCount:10,
              selectedVideos:[]
            },
            respVideoData: {data:[], total:null},
            columns: [
              {
                type: "selection",
                width: 60,
                align: "center"
              },
              {
                title: "视频id",
                key: "id",
                align: "center"
              },
              {
                title: "视频标题",
                key: "title",
                slot: "title",
                align: "center"
              },
              {
                title: "上传者id",
                key: "userId",
                align: "center"
              },
              {
                title: "上传时间",
                key: "createTime",
                align: "center"
              },
              {
                title: "操作",
                slot: "action",
                align: "center"
              }
            ],
          }
        },
        created(){
          this.init();
        },
        methods:{
          init(){
            this.videoService = new VideoService(this);
            this.authPermissionService = new AuthPermissionService(this);
            this.authPermissionService.videoAuditAuth(function (_this, result) {
              if(result == false){
                _this.$router.push({path:'/noAuth'}) ;
              }
            });
            this.searchUnAuditVideo(0,10);
          },
          searchUnAuditVideo(currentPage, pageCount){
            let params = {
              "title": this.formData.searchTitle,
              "orderType": 0,
              "auditState": 0,
              "transState": 1,
              "page":{"start":currentPage+"", "count":pageCount+""}
            };
            this.videoService.searchVideo(params, function (_this, data) {
              _this.respVideoData.data = data.data;
              _this.respVideoData.total = data.page.total;
            });
          },
          videoAudit(row, auditState){
            // console.log(row.id);
            let params = {
              "videoId":row.id,
              "auditState":auditState
            };
            this.videoService.videoAudit(params, function (_this, data) {
                _this.$Message.success("审核成功");
                _this.searchUnAuditVideo(0,10)
            });
          },
          toVideoDetail(row){
            let routeUrl = this.$router.resolve({
              path: "/videoDetail",
              query: {videoId:row.id}
            });
            window.open(routeUrl.href, '_blank');
          },
          getCurrentPage(num){
            this.formData.currentPage = num-1;
            this.searchUnAuditVideo(this.formData.currentPage, this.formData.pageCount);
          },
          getPageCount(pageSize){
            this.formData.pageCount = pageSize;
            this.searchUnAuditVideo(this.formData.currentPage, this.formData.pageCount);
          },
          getSelectList(selection){
            this.formData.selectedVideos = selection;
          },
        }
    }
</script>

<style scoped>
  .video-search {
    margin-top: 20px;
    margin-left: 20px;
    display: flex;
  }
</style>
